import { Button, Modal, Form, Select, Input, Radio, message, InputNumber } from 'antd'
import { http } from '@/utils'
import { useEffect, useState, useImperativeHandle } from 'react'
import { useStore } from '@/store'

const Configlistmodal = (props) => {
  const configModalOpenOk = () => {
    setShowModalOpen(false)
  }
  const configModalOpenCancel = () => {
    setShowModalOpen(false)
  }
  const { loginStore } = useStore()
  const [showModalOpen, setShowModalOpen] = useState(false)
  const [configRow, setConfigRow] = useState({})
  const [dictObj, setDictObj] = useState([])
  const supportEmpty = [
    { label: "是", value: '1' },
    { label: "否", value: '0' }
  ]
  const [accountTypeOpt, setAccountTypeOpt] = useState([])
  const [loading, setLoading] = useState(false)

  // 父组件调用打开模态框
  useImperativeHandle(props.onRef, () => {
    return {
      openModalOpen: openModalOpen,
    }
  })
  const openModalOpen = (data) => {
    console.log(data)
    setConfigRow({ ...data })
    form.resetFields()
    setLoading(false)
    setShowModalOpen(true)
  }
  const [form] = Form.useForm()

  const addOrUpdateAlarmGroup = async (values) => {
    setLoading(true)
    const res = await http.post('/alarm/deliversign/addTbTradeUser', { userId: configRow.userId, ...values })
    setLoading(false)
    message.success(res.body)
    setShowModalOpen(false)
  }
  useEffect(() => {
    const getDicfig = async () => {
      const res = await http.post('/alarm/deliversign/getDicConfig', {
        userId: loginStore.userId,
        dictIds: [1000, 1001, 1002, 1003, 1004, 1005, 1006]
      })
      // setTradeDirectionOpt(res.body['1001'].map(item => ({ label: item.dictName, value: item.dictCode })))
      setAccountTypeOpt(res.body['1004'].map(item => ({ label: item.dictName, value: item.dictCode })))
      setDictObj(res.body)
      console.log('字典-', res.body)
    }
    if (showModalOpen && !dictObj[1000]) {
      getDicfig()
    }
  }, [loginStore, showModalOpen, dictObj])
  return (
    <>
      <Modal
        title={`添加交易账号（${configRow.username}）`}
        open={showModalOpen}
        onOk={configModalOpenOk}
        onCancel={configModalOpenCancel}
        footer={false}
      >
        <Form
          form={form}
          colon={false}
          validateTrigger={['onBlur', 'onChange']}
          onFinish={addOrUpdateAlarmGroup}
          labelCol={{ span: 7 }}
          wrapperCol={{ span: 16 }}
          initialValues={{}}
        >
          <Form.Item
            label="账号类型"
            name="accountType"
            rules={[
              {
                required: true,
                message: '请选择账号类型',
              }
            ]}
          >
            <Select
              style={{ width: 260 }}
              allowClear
              placeholder="请选择账号类型"
              options={accountTypeOpt}
            />
          </Form.Item>

          <Form.Item
            label="用户名/标识"
            name="account"
            rules={[
              {
                required: true,
                message: '请输入用户名/标识',
              }
            ]}>
            <Input
              allowClear
              placeholder='请输入用户名/标识'
              style={{ width: 260 }}
            />
          </Form.Item>
          <Form.Item
            label="密码/密钥"
            name="password"
            rules={[
              {
                required: true,
                message: '请输入密码/密钥',
              }
            ]}>
            <Input
              allowClear
              placeholder='请输入密码/密钥'
              style={{ width: 260 }}
            />
          </Form.Item>
          <Form.Item
            label="最大下单份数"
            name="maxSize"
            rules={[
              {
                required: true,
                message: '请输入最大下单份数',
              }
            ]}>
            <InputNumber
              placeholder='请输入最大下单份数'
              style={{ width: 260 }}
            />
          </Form.Item>
          <Form.Item
            label="支持空单"
            name="supportEmpty"
            rules={[
              {
                required: true,
                message: '请选则是否支持空单',
              }
            ]}>
            <Radio.Group options={supportEmpty} />
          </Form.Item>
          <Form.Item label=" " style={{ margin: 0 }}>
            <div style={{ textAlign: 'right' }}>
              <Button htmlType="submit" type="primary" loading={loading}>
                提交
              </Button>
            </div>
          </Form.Item>
        </Form>
      </Modal>

    </>
  )
}
export default Configlistmodal
